<template>
  <van-popup v-model="show" round position="bottom" @close="closePopup" class="component-search-list">
    <van-search v-model="name" placeholder="请输入搜索关键词" shape="round" @input="getList" v-if="search" />
    <p v-if="lists.length == 0">暂无列表</p>
    <van-cell-group class="mcc-list" v-else>
      <van-cell v-for="(item,index) in lists" :key="index" @click="handleSelect(item)" :icon="item.id == currentValue.id ? 'checked' : 'circle'" :title="item.name" v-show="item.isShow" />
    </van-cell-group>
  </van-popup>
</template>

<script>
export default {
  props:{
    search: {
      type: Boolean,
      default: () => false,
    }
  },
  data(){
    return{
      show: false,
      name: null,
      currentValue:{},
      lists: [],
    }
  },
  methods:{
    init(row, list){
      this.show = true;
      this.lists = list;
      this.currentValue = row || {};
      this.getList();
    },
    closePopup(){
      this.name = null;
    },
    getList(val){
      this.lists.forEach((item,index) => {
        if(val){
          if(item.name.indexOf(val) != -1){
            this.lists[index].isShow = true;
          }else{
            this.lists[index].isShow = false;
          }
        }else{
          this.lists[index].isShow = true;
        }
      })
    },
    handleSelect(item){
      this.currentValue = item;
      this.$emit('confirm', item);
      this.show = false;
    }
  }
}
</script>

<style>

</style>